import React, { useState, useEffect } from 'react'
import { route } from '@/interface'

export default function NavSelect(props: any) {
    const [activeName, setActiveName] = useState<string>("首页")
    const [isOpen, setIsOpen] = useState(false)
    const { history, route: { routes } } = props
    return (
        <div className="nav_select">
            {/* setIsOpen((prev)=>{
                // prev 上一次的值
                return prev+1
            }) */}
            <span onClick={() => { setIsOpen(prev => !prev) }}>
                {activeName} <i className='iconfont icon-jiantou'></i>
            </span>
            {
                isOpen ? <div className="pos_box">
                    {routes.map((item: any) => {
                        return <>
                            {
                                item.hidden ? <></> : <div key={item.path} onClick={() => {
                                    history.push(item.path)
                                    setIsOpen(false)
                                    setActiveName(item.title)
                                }}>
                                    {item.title}
                                </div>
                            }</>
                    })}
                </div> : ''
            }
        </div >
    )
}
